<template>
	<view>
		<uni-view class="cu-list menu-avatar">
			<uni-view class="cu-item" v-if="docMsg==null">
				<uni-view class="cu-avatar round lg" style='background-image: url(../../static/me/head.png);'>
				</uni-view>
				<uni-view class="content">
					<uni-view class="text-black text-m">
						<uni-text class="text-cut"><span style="font-weight:bold;">请点击右侧选择医师</span></uni-text>
					</uni-view>
				</uni-view>
				<uni-view class="action">
					<uni-view class="text-grey text-m"><span @click="goSelect">更换 ></span></uni-view>
				</uni-view>
			</uni-view>

			<uni-view class="cu-item" v-if="docMsg!=null">
				<uni-view class="cu-avatar round lg" style='background-image: url(../../static/me/head.png);'>
				</uni-view>
				<uni-view class="content">
					<uni-view class="text-black text-m">
						<uni-text class="text-cut"><span style="font-weight:bold;">{{docMsg.doctorName}}</span>
						</uni-text>
						<uni-view class="cu-tag round bg-orange " style="height: 20px;margin-left: 5px;">
							{{docMsg.levelName}}</uni-view>
					</uni-view>
					<uni-view class="text-black text-sm flex">
						<uni-text class="text-cut">
							<span>{{docMsg.deptName}}</span>
						</uni-text>
					</uni-view>
				</uni-view>
				<uni-view class="action">
					<uni-view class="text-grey text-m"><span @click="goSelect">更换 ></span></uni-view>
				</uni-view>
			</uni-view>
		</uni-view>

		<uni-view class="cu-form-group margin-top">
			<uni-view class="title">问诊人<span style="color: #F43F3B;">*</span></uni-view>
			<uni-input style="position: relative;">
				<div><input maxlength="140" align="right" step="" autocomplete="off" type=""
						style="height: 26.25px; line-height: 26.25px;">
					<div class="input-placeholder" style="height: 26.25px; line-height: 26.25px;"></div>
				</div>
				<uni-resize-sensor>
					<div>
						<div></div>
					</div>
					<div>
						<div></div>
					</div>
				</uni-resize-sensor>
			</uni-input>
		</uni-view>
		<!--  -->
		<span @click="goInfo()">
			<uni-view class="cu-form-group" >
				<uni-view class="title">点击填写个人信息<span style="color: #F43F3B;">*</span></uni-view>
				<uni-view v-if="infoForm==null" class="cu-tag round bg-orange " style="height: 20px;margin-left: 5px;">
					未填写 X</uni-view>
				<uni-view v-if="infoForm!=null" class="cu-tag round bg-orange " style="height: 20px;margin-left: 5px;">
					已填写 √</uni-view>
				<uni-view class="action">
					<uni-view class="text-grey text-m">></uni-view>
				</uni-view>
			</uni-view>
		</span>

		<uni-view class="cu-form-group">
			<uni-view class="title">确诊诊断<span style="color: #F43F3B;">*</span></uni-view>
			<uni-input style="position: relative;">
				<div><input maxlength="140" align="right" step="" autocomplete="off" type=""
						style="height: 26.25px; line-height: 26.25px;">
					<div class="input-placeholder" style="height: 26.25px; line-height: 26.25px;"></div>
				</div>
				<uni-resize-sensor>
					<div>
						<div></div>
					</div>
					<div>
						<div></div>
					</div>
				</uni-resize-sensor>
			</uni-input>
		</uni-view>

		<uni-view class="cu-form-group">
			<uni-view class="title">所需药品<span style="color: #F43F3B;">*</span></uni-view>
			<uni-view class="action">
				<uni-view class="text-grey text-m">添加 ></uni-view>
			</uni-view>

		</uni-view>



		<uni-view class="cu-form-group" style="border-top: 0px solid rgba(192,192,192,0.5);">
			<uni-view class="content">
				<u-tag class="tags" type="success" text="药品1" shape="circleRight" closeable :show="show"
					@close="tagClick" />
				<u-tag class="tags" type="success" text="药品2" closeable :show="show" @close="tagClick" />
			</uni-view>
		</uni-view>

		<uni-view class="cu-form-group margin-top">
			<uni-view class="title">病情描述<span style="color: #F43F3B;">*</span></uni-view>
		</uni-view>
		<uni-view class="cu-form-group" style="height:100px">
			<textarea v-model="illContent">
		  </textarea>
		</uni-view>

		<uni-view class="cu-form-group margin-top">
			<uni-view class="title">病情照片</uni-view>
			<u-modal v-model="show" :title-style="{color: 'red'}" :mask-close-able="true">
				<view class="slot-content">
					<rich-text :nodes="content"></rich-text>
				</view>
			</u-modal>
			<uni-view><span class="action cuIcon-question" @click="openMsg"></span></uni-view>
		</uni-view>
		<uni-view class="cu-form-group">
			<uni-view class="grid col-4 grid-square flex-sub">
				<uni-view class="padding-xs solids">
					<uni-text class="cuIcon-cameraadd"><span></span></uni-text>
				</uni-view>
			</uni-view>
		</uni-view>

		<u-button type="success margin-top" @click="navitry">提交</u-button>
	</view>
</template>

<script>
	import drugData from "@/common/drugData.js";
	export default {
		data() {
			return {
				show: false,
				content: `
									请上传病情照片、化验单、检查资料、
									报告单、药品处方单子若为皮肤问题，
									建议对准患处拍照。照片严格保密。
								`,
				illContent: '',
				name: '',
				drug: drugData,
				docMsg: null,
				/*{
					doctor_id:1,
					doctor_name:'test1',
					org_name:'机构1',
					dept_name:'科室1',
					level_name:'主任',
					avatar_url:''
				}*/
				//提交信息页面表单传值
				infoForm:null

			}
		},
		methods: {
			tagClick(index) {
				this.show = false;
			},
			openMsg() {
				this.show = true;
			},
			navitry() {
				uni.navigateTo({
					url: '../history/history'
				})
			},
			goInfo(){
				uni.navigateTo({
					url: '../infomation/infomation'
				})
			},
			goSelect() {
				uni.navigateTo({
					url: '../selectDoc/selectDoc'
				})
			}
		}
	}
</script>

<style>
	.cu-form-group .title {
		text-align: justify;
		padding-right: 16px;
		font-size: 16px;
		position: relative;
		height: 32px;
		line-height: 32px;
	}

	.tags {
		margin-left: 5px;
	}

	.beforeitem {
		content: "";
		position: absolute;
		border-left: 4px solid $u-type-primary;
		height: 32rpx;
		left: 0;
		top: 39rpx;
	}

	.slot-content {
		font-size: 28rpx;
		color: $u-content-color;
		padding-left: 30rpx;
	}
</style>
